<template>
    <main class="aside">
    </main>
</template>

<script>
export default {
    name: 'Aside',
}
</script>

<style scope lang="less">
    .aside{
        height: 100%;
        animation: rotation 15s infinite;
        background: url('../assets/bg01.jpg') no-repeat center;
        background-size: cover;
    }

    @keyframes rotation {
        0% {
            background-image: url('../assets/bg01.jpg');
        }
        25%{
            background-image: url('../assets/bg02.jpg');
        }
        50%{
            background-image: url('../assets/bg03.jpg');
        }
        75%{
            background-image: url('../assets/bg04.jpg');
        }
        100%{
            background-image: url('../assets/bg01.jpg');
        }
    }
</style>